const gulp = require("gulp");
const gulpImport = require("gulp-html-import");
const less = require("gulp-less");
const postcss = require("gulp-postcss");
const autoprefixer = require("autoprefixer");
const cssmin = require("gulp-minify-css");
const gulpClean = require("gulp-clean");

exports.html = function () {
    console.log("---task html start---")
    return gulp.src("./src/*.html")
        .pipe(gulpImport("./src/html/"))
        .pipe(gulp.dest("./dist/src"));
}

//编译 less、postCss添加前缀、压缩css文件
//当所有 less 文件发生改变的时候，调用 less 任务
// gulp.watch("./src/less/*.less", {}, ["less"]);
// console.log("---task less end---")
//less 编译有问题，不知道原因
exports.less = function(){
    console.log("---task less start---")
    // .pipe(sourcemaps.init())
    return gulp.src("./src/less/*.less")
    .pipe(less())
    .pipe(postcss())
    .pipe(autoprefixer())
    .pipe(cssmin())
    .pipe(gulp.dest("./dist/css"));
    // .pipe(sourcemaps.write())
}
//-- gulp-less 匹配模式 --
//编译src目录下的所有less文件
//除了reset.less和test.less（**匹配src/less的0个或多个子文件夹）
// gulp.src(['src/less/*.less', '!src/less/**/{reset,test}.less']) 

exports.clean = function(){
    console.log("---task clean start---")
    //为什么这里要 return
    return gulp.src("./dist", { read: false, allowEmpty: true }).pipe(gulpClean());
}

//@todo 编译后能不能自动替换路径呢？
exports.img = function(){
    console.log("---task img start---")
    return gulp.src("./src/imgs").pipe(gulp.dest("./dist/imgs"));
}

//@todo 编译处理后的 img 文件添加hash 怎么处理，待定
//@todo 编译处理后的css文件添加hash怎么配置，待定
//直接对 dist 目录的文件 hash，问题来了，引用的路径呢怎么搞？——会自动替换吗？
exports.hash = function(){
    console.log("---task hash start---")
    return gulp.src(["./dist/imgs/","./dist/css/*.less","./dist/imgs/*.{png,gif,jpg,jpeg}"])
}

//browser-sync 配置
exports.server = function(){

}